<template>
    <div id="userManage" class="center_div">
        <div class="leftTreeClass tree-container">
            <div style="height: 90%;overflow:auto;margin-top: 1%">
                <el-tree check-strictly
                         :load="loadChildren"
                         highlight-current
                         lazy
                         class="tree"
                         node-key="id"
                         :props="defaultProps"
                         :filter-node-method="filterNode"
                         ref="tree"
                         @node-click="loadDataaa">
                <span class="custom-tree-node dataManageBtn24px" slot-scope="{ node, data }">
                     <span v-if="data.type===0"><img class="treeLableImg" src="@/assets/images/mapicon/tree_fleet.png"
                     >{{ node.label }}</span>
                    <span v-if="data.type===1"><img class="treeLableImg" src="@/assets/images/mapicon/tree_fleet.png"
                    >{{ node.label }}</span>
                  </span>
                </el-tree>
            </div>
        </div>
        <div class="searchForm" style="float:right;width: 80%;margin-top: 1%">
            <el-form :inline="true" class="demo-form-inline">
                <el-form-item label="用户名">
                    <el-input v-model="userName"></el-input>
                </el-form-item>
                <el-form-item label="所属部门">
                    <el-select v-model="fleetName" :placeholder="'请选择'" filterable clearable id="userSearch"
                               @focus="$('#userSearch .el-select-dropdown').show()" @blur="queryselectChange">
                        <el-option :value="fleetName" style="height: auto">
                            <el-tree
                                    class="dataManage18px"
                                    :load="loadChildren"
                                    highlight-current
                                    lazy
                                    node-key="id"
                                    :props="defaultProps"
                                    :filter-node-method="filterNode"
                                    ref="tree"
                                    @node-click="loadData">
                            </el-tree>
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="querySearch" class="dataManageBtn22BtnpPx">查询
                    </el-button>
                    <el-button type="primary" @click="add" class="dataManageBtn22BtnpPx">添加</el-button>
<!--                    <el-button type="primary" @click="getUser" class="dataManageBtn22BtnpPx">查询调度员</el-button>-->

                </el-form-item>
            </el-form>
        </div>
        <div class="table-wrap" style="float:right;width: 80%;margin-top: -1%">
            <el-table
                    :data="tableData"
                    style="width:100%;text-align: center;border-left:1px solid #EBEBEB;"
                    border
                    :header-cell-style="headerCellClassName"
                    cell-class-name="dataManage18px">
                <el-table-column align="center" v-for="title in tableTitle" :prop="title.prop" :label="title.label"
                                 :show-overflow-tooltip="title.overflowTooltip" :width="title.width">
                </el-table-column>
                <template v-if="buttons && buttons.length!==0">
                    <el-table-column
                            class="align-right"
                            width="320"
                            header-align="center"
                            label="操作"
                            align="center">
                        <template slot-scope="scope">
                            <el-button v-for="button in buttons"
                                       @click="operate(scope.row,button.href)" :type="button.type"
                                       class="el-button el-button--text  dataManageBtn22px">{{button.label}}
                            </el-button>
                        </template>
                    </el-table-column>
                </template>
            </el-table>
            <el-pagination
                    layout="total,prev, pager, next"
                    background
                    @current-change="changePageNum"
                    :current-page="pageNum"
                    :page-size="pageSize"
                    :total="total">loadChildren
            </el-pagination>
        </div>
        <div>
            <el-dialog :title="title" :visible.sync="showBox" width="60%" append-to-body @close="closeAddDialog">
                <el-form ref="form" :model="form" :rules="rules" label-width="160px">
                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="登陆编号" prop="userId">
                                <el-input v-model="form.userId" :disabled="showAdd==true?false:true"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="用户名" prop="userName">
                                <el-input v-model="form.userName"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="IP分机号码" prop="extNumber">
                                <el-input v-model="form.extNumber" type="number"
                                          onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="部门名称" prop="fleetName">
                                <el-select v-model="form.fleetName" :placeholder="'请选择'" filterable id="userMgAdd"
                                           @focus="$('#userMgAdd .el-select-dropdown').show()">
                                    <el-option :value="form.fleetName" style="height: auto">
                                        <el-tree
                                                :load="loadChildren"
                                                highlight-current
                                                lazy
                                                node-key="id"
                                                :props="defaultProps"
                                                :filter-node-method="filterNode"
                                                ref="tree"
                                                @node-click="loadDataa">
                                              <span class="custom-tree-node detailsLableL"
                                                    slot-scope="{ node, data }">
                                            <span v-if="data.type===0"><img src="@/assets/images/mapicon/tree_fleet.png"
                                                                            class="treeLableImg">{{ node.label }}</span>
                                            <span v-if="data.type===1"><img src="@/assets/images/mapicon/tree_fleet.png"
                                                                            class="treeLableImg">{{ node.label }}</span>
                                        </span>
                                        </el-tree>
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="所属角色名称" prop="roleName" :popper-append-to-body="false">
                                <el-select v-model="form.roleName" placeholder="请选择" multiple id="roleNameOptions"
                                           @focus="$('#roleNameOptions .el-select-dropdown').show()">
                                    <el-option
                                            v-for="item in roleNameOptions"
                                            :key="item.id"
                                            :label="item.name"
                                            :value="item.id">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="通讯录管理层级" prop="abfleetName">
                                <el-select v-model="form.abfleetName" :placeholder="'请选择'" filterable
                                           @focus="$('#userMgAdd .el-select-dropdown').show()">
                                    <el-option :value="form.abfleetName" style="height: auto">
                                        <el-tree
                                                :load="loadChildren"
                                                highlight-current
                                                lazy
                                                node-key="id"
                                                :props="defaultProps"
                                                :filter-node-method="filterNode"
                                                ref="tree"
                                                @node-click="clickabfleetId">
                                              <span class="custom-tree-node detailsLableL"
                                                    slot-scope="{ node, data }">
                                            <span v-if="data.type===0"><img src="@/assets/images/mapicon/tree_fleet.png"
                                                                            class="treeLableImg">{{ node.label }}</span>
                                            <span v-if="data.type===1"><img src="@/assets/images/mapicon/tree_fleet.png"
                                                                            class="treeLableImg">{{ node.label }}</span>
                                        </span>
                                        </el-tree>
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12" v-if="false">
                            <el-form-item label="绑定左话机" style="width: 100%;">
                                <el-select v-model="form.leftExt" placeholder="请选择">
                                    <el-option
                                            v-for="item in leftextNumberArray"
                                            :key="item.subscriber_id"
                                            :label="item.name"
                                            :value="item.extNumber">
                                    </el-option>
                                </el-select>
                                <!--        <el-input v-model="form.leftExt" type="number" :min="0"
                                                  onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))"></el-input>
                                 -->   </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row v-if="false">
                        <el-col :span="12">
                            <el-form-item label="坐席类型" prop="agentType">
                                <el-select v-model="form.agentType" placeholder="请选择" @change="handleAgentTypeChange">
                                    <el-option label="AOC坐席" :value="1"></el-option>
                                    <el-option label="非AOC坐席" :value="0"></el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12" v-if="form.agentType == 1">
                            <el-form-item label="位置编号" prop="agentId">
                                <el-select v-model="form.agentId" placeholder="请选择">
                                    <el-option
                                            v-for="item in AgentIdArray"
                                            :key="item.agentId"
                                            :label="item.name"
                                            :value="item.agentId">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-form>
                <div slot="footer" class="dialog-footer">
                    <el-button class="dataManageBtn22BtnpPx" @click="closeBox">取 消</el-button>
                    <el-button class="dataManageBtn22BtnpPx" type="primary" @click="addUser('form')"
                               v-show="showAdd">添 加
                    </el-button>
                    <el-button class="dataManageBtn22BtnpPx" type="primary" @click="updateUser('form')"
                               v-show="!showAdd">修 改
                    </el-button>
                </div>
            </el-dialog>
        </div>
        <div>
            <el-dialog :title="title" :visible.sync="showEPBox" width="40%" append-to-body @close="closePwdDialog">
                <el-form ref="pwdForm" :model="form" status-icon :rules="pwdRules" label-width="140px">
                    <el-row>
                        <el-form-item label="登陆编号">
                            <el-input v-model="form.userId" :disabled="true"></el-input>
                        </el-form-item>
                    </el-row>
                    <el-row>
                        <el-form-item label="新密码" prop="password">
                            <el-input v-model="form.password" type="password" show-password
                                      autocomplete="off"></el-input>
                        </el-form-item>
                    </el-row>
                    <el-row>
                        <el-form-item label="重复新密码" prop="newPassword">
                            <el-input v-model="form.newPassword" type="password" show-password
                                      autocomplete="off"></el-input>
                        </el-form-item>
                    </el-row>
                </el-form>
                <div slot="footer" class="dialog-footer">
                    <el-button @click="closeBox" class="dataManageBtn22BtnpPx">取消</el-button>
                    <el-button type="primary" @click="updatePassword('pwdForm')" class="dataManageBtn22BtnpPx">修 改
                    </el-button>
                </div>
            </el-dialog>
        </div>
    </div>
</template>

<script>
  import UserManage from '@/api/dataManages/UserManage';
  import {Md5_Encrpt} from '@/utils/Emd5.js';
  import {mapActions} from 'vuex';
  import AgentApi from '../../api/AgentApi';
  import HomeApi from '../../api/HomeApi';
  import AgentsArray from '../../views/agents';
  import {DispatchCtrlLib} from '../../chromeLib/DispatchCtrlLib';

  export default {
    name: 'userManage',
    props: {
      FleetId: Number,
      userId: Number,
    },
    data() {
      var validatePass = (rule, value, callback) => {
        if (value === '') {
          callback(new Error('请输入密码'));
        } else {
          if (this.form.password !== '') {
            this.$refs.pwdForm.validateField('checkPass');
          }
          callback();
        }
      };
      var validatePass2 = (rule, value, callback) => {
        if (value === '') {
          callback(new Error('请再次输入密码'));
        } else if (value !== this.form.password) {
          callback(new Error('两次输入密码不一致!'));
        } else {
          callback();
        }
      };
      return {
        defaultProps: {
          label: 'name',
          isLeaf: 'isLeaf',
        },
        AgentsArray: [
          //分机号状态  //String	0-离线 1-空闲 2-回铃中 3-响铃中 4-呼叫中
          {
            id: 1,
            number: '5120',//A1-1分机号,
            status: 0,
            ExtenName: 'wxq01',
            name: 'C15', sortId: 15,
          },
          {
            id: 2,
            number: '5208',//A1-1分机号,
            status: 0,
            ExtenName: 'llctest',
            name: 'C16', sortId: 16,
          }, {
            id: 3,
            number: '5206',//A1-1分机号,
            status: 0,
            ExtenName: 'dwinner',
            name: 'C08', sortId: 8,
          },
          {
            id: 4,
            number: '5204',//话机1
            status: 0,
            ExtenName: '话机1',
            name: 'C09', sortId: 9,
          },
          {
            id: 5,
            number: '5205',//话机2
            status: 0,
            ExtenName: '话机2',
            name: 'C01', sortId: 1,
          }, {
            id: 6,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'C02', sortId: 2,
          },
          {
            id: 7,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'C17', sortId: 17,
          },
          {
            id: 8,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'C18', sortId: 18,
          },
          {
            id: 9,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'C19', sortId: 19,
          },
          {
            id: 10,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'C20', sortId: 20,
          }, {
            id: 11,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'C21', sortId: 21,
          }, {
            id: 12,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'C10', sortId: 10,
          }, {
            id: 13,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'C11', sortId: 11,
          }, {
            id: 14,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'C12', sortId: 12,
          }, {
            id: 15,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'C13', sortId: 13,
          }, {
            id: 16,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'C14', sortId: 14,
          }, {
            id: 17,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'C03', sortId: 3,
          }, {
            id: 18,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'C04', sortId: 4,
          }, {
            id: 19,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'C05', sortId: 5,
          }, {
            id: 20,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'C06', sortId: 6,
          }, {
            id: 21,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'C07', sortId: 7,
          }, {
            id: 22,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D16',
            sortId: 16,
          }, {
            id: 23,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D17',
            sortId: 17,
          }, {
            id: 24,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D18',
            sortId: 18,
          }, {
            id: 25,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D19',
            sortId: 19,
          }, {
            id: 26,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D20',
            sortId: 20,
          }, {
            id: 27,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D08',
            sortId: 8,
          }, {
            id: 28,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D09',
            sortId: 9,
          }, {
            id: 29,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D10',
            sortId: 10,
          }, {
            id: 30,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D12',
            sortId: 12,
          }, {
            id: 31,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D13',
            sortId: 13,
          }, {
            id: 32,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D01',
            sortId: 1,
          }, {
            id: 33,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D02',
            sortId: 2,
          }, {
            id: 34,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D03',
            sortId: 3,
          }, {
            id: 35,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D04',
            sortId: 4,
          }, {
            id: 36,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D05', sortId: 5,
          }, {
            id: 37,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D21', sortId: 21,
          }, {
            id: 38,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D22', sortId: 22,
          }, {
            id: 39,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D14', sortId: 14,
          }, {
            id: 40,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D15', sortId: 15,
          }, {
            id: 41,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D06', sortId: 6,
          }, {
            id: 42,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'D07', sortId: 7,
          }, {
            id: 43,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B24', sortId: 24,
          }, {
            id: 44,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B25', sortId: 25,
          }, {
            id: 45,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B26', sortId: 26,
          }, {
            id: 46,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B27', sortId: 27,
          }, {
            id: 47,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B28', sortId: 28,
          }, {
            id: 48,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B29', sortId: 29,
          }, {
            id: 49,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B23', sortId: 23,
          }, {
            id: 50,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B22', sortId: 22,
          }, {
            id: 51,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B21', sortId: 21,
          }, {
            id: 52,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B20', sortId: 20,
          }, {
            id: 53,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B19', sortId: 19,
          }, {
            id: 54,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B18', sortId: 18,
          }, {
            id: 55,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B30', sortId: 30,
          }, {
            id: 56,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B01', sortId: 1,
          }, {
            id: 57,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B17', sortId: 17,
          }, {
            id: 58,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B16', sortId: 16,
          }, {
            id: 59,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B15', sortId: 15,
          }, {
            id: 60,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B14', sortId: 14,
          }, {
            id: 61,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B02', sortId: 2,
          }, {
            id: 62,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B03', sortId: 3,
          }, {
            id: 63,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B04', sortId: 4,
          }, {
            id: 64,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B05', sortId: 5,
          }, {
            id: 65,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B06', sortId: 6,
          }, {
            id: 66,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B07', sortId: 7,
          }, {
            id: 67,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B08', sortId: 8,
          }, {
            id: 68,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B13', sortId: 13,
          }, {
            id: 69,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B12', sortId: 12,
          }, {
            id: 70,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B11', sortId: 11,
          }, {
            id: 71,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B10', sortId: 10,
          }, {
            id: 72,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'B09', sortId: 9,
          }, {
            id: 73,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A18', sortId: 18,
          }, {
            id: 74,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A19', sortId: 19,
          }, {
            id: 75,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A20', sortId: 20,
          }, {
            id: 76,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A21', sortId: 21,
          }, {
            id: 77,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A12', sortId: 12,
          }, {
            id: 78,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A13', sortId: 13,
          }, {
            id: 79,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A14', sortId: 14,
          }, {
            id: 80,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A01', sortId: 1,
          }, {
            id: 81,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A02', sortId: 2,
          }, {
            id: 82,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A03',
            sortId: 3,
          }, {
            id: 83,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A04', sortId: 4,
          }, {
            id: 84,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A22', sortId: 22,
          }, {
            id: 85,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A23', sortId: 23,
          }, {
            id: 86,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A24', sortId: 24,
          }, {
            id: 87,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A25', sortId: 25,
          }, {
            id: 88,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A26', sortId: 26,
          }, {
            id: 89,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A27', sortId: 27,
          }, {
            id: 90,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A28', sortId: 28,
          }, {
            id: 91,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A29', sortId: 29,
          }, {
            id: 92,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A05', sortId: 5,
          }, {
            id: 93,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A06', sortId: 6,
          }, {
            id: 94,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A07', sortId: 7,
          }, {
            id: 95,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A30', sortId: 30,
          }, {
            id: 96,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A31', sortId: 31,
          }, {
            id: 97,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A32', sortId: 32,
          }, {
            id: 98,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A33', sortId: 33,
          }, {
            id: 99,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A15', sortId: 15,
          }, {
            id: 100,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A16', sortId: 16,
          }, {
            id: 101,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A17', sortId: 17,
          }, {
            id: 102,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A08', sortId: 8,
          }, {
            id: 103,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A09', sortId: 9,
          }, {
            id: 104,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A10', sortId: 10,
          }, {
            id: 105,
            number: '',
            status: 0,
            ExtenName: '',
            name: 'A11', sortId: 11,
          },

        ],
        userName: '',
        fleetName: '',
        searchData: {},
        tableTitle: [
          {label: '调度员ID', prop: 'ID', overflowTooltip: true},
          {label: '调度员名称', prop: 'NAME', overflowTooltip: true},
          {label: '调度员分机号', prop: 'EXTNUMBER', overflowTooltip: true},
          // {label: '绑定座机号', prop: 'leftExt'},
          {label: '创建时间', prop: 'CREATEDATETIME', overflowTooltip: true, width: '300'},
          {label: '所属部门', prop: 'fleetName', overflowTooltip: true},
        ],
        rules: {
          userId: [
            {required: true, message: '请输入登陆编号', trigger: 'blur'},
            {min: 1, max: 30, message: '长度在 1 到 30 个字符', trigger: 'blur'},
          ],
          userName: [
            {required: true, message: '请输入用户名', trigger: 'blur'},
            {min: 1, max: 30, message: '长度在 1 到 30 个字符', trigger: 'blur'},
          ], extNumber: [
            {required: true, message: '请输入IP分机号码', trigger: 'blur'},
          ], fleetName: [
            {required: true, message: '请选择部门名称', trigger: 'change'},
            {min: 1, max: 30, message: '长度在 1 到 30 个字符', trigger: 'blur'},
          ], abfleetName: [
            {required: true, message: '请选择通讯录管理层级', trigger: 'change'},
          ],
          roleName: [
            {required: true, message: '请选择所属角色名称', trigger: 'change'},
          ], agentType: [
            {required: true, message: '请选择坐席类型', trigger: 'change'},
          ], agentId: [
            {required: true, message: '请选择位置编号', trigger: 'change'},
          ],
        },
        pwdRules: {
          password: [
            {required: true, validator: validatePass, trigger: 'blur'},
          ],
          newPassword: [
            {required: true, validator: validatePass2, trigger: 'blur'},
          ],
        },
        tableData: [],
        leftextNumberArray: [],
        total: 0,
        pageNum: 1,
        pageSize: 10,
        buttons: [{label: '编辑', href: 'update'}, {label: '删除', href: 'delete'}, {label: '修改密码', href: 'password'}],
        showBox: false,
        showEPBox: false,
        showAdd: true,
        title: '',
        chooseloadData: true,
        form: {
          userId: '',
          user_id: '',
          userName: '',
          fleetId: '',
          fleetName: '',
          abfleetId: '',
          abfleetName: '',
          extNumber: '',
          roleName: [],
          password: '',
          newPassword: '',
          leftExt: '',
          rightExt: '',
          agentType: 1,
          agentId: null,
        },
        tempAgentId: '',
        sipZDId: '',
        extNumberOptions: [],
        roleNameOptions: [],
        AgentTypes: [
          {
            value: '1',
            label: 'AOC坐席',
          }, {
            value: '0',
            label: '非AOC坐席',
          },
        ],
        AgentIdArray: [],
        options: [
          {
            label: '热门城市',
            options: [
              {
                value: 'Shanghai',
                label: '上海',
              }, {
                value: 'Beijing',
                label: '北京',
              }],
          }, {
            label: '城市名',
            options: [
              {
                value: 'Chengdu',
                label: '成都',
              }, {
                value: 'Shenzhen',
                label: '深圳',
              }, {
                value: 'Guangzhou',
                label: '广州',
              }, {
                value: 'Dalian',
                label: '大连',
              }],
          }],
        checkGroup: 'true', checkFleet: 'true', checkMonitor: 'true',
      };
    },
    updated() {
    },
    created() {
      this.changeDmgPage();
    },
    mounted() {
      this.query();
      this.getExtNumber();
      this.getRoleName();
      this.queryAllSubTypes();
    },
    computed: {
      extNumberA() {
        return this.form.extNumber;
      },
    },
    watch: {
      extNumberA(val) {
        if (val.length > 10) {
          this.$message.error('分机号不能超过10位数字');
          this.form.extNumber.substring(0, 10);
        }
      },
    },
    methods: {
      querySearch() {
        this.query(1);
        this.pageNum = 1;
      },
      changeDmgPage() {
        let w = window.screen.width;
        let h = window.screen.height;
        if (w == 1920) {
          if (h == 1080) {
            this.pageSize = 9;
          } else {
            this.pageSize = 11;
          }
        }
      },
      //表头样式
      headerCellClassName() {
        return 'font-size:18px;color:#515A6E;padding:10px 0px 10px 0px !important;background:#F5F5F6;border:1px solid #EBEBEB';
      },
      //表格样式
      cellStyleClassName() {
        return 'font-size:13px;text-align:center;color:#606266;padding:5px 0px 5px 0px !important;border:1px solid #EBEBEB';
      },
      queryAllSubTypes() {
        HomeApi.queryAllSubType({}).then(res => {
          if (res.success) {
            let checkDatas = res.obj.list;
            let len = checkDatas.length;
            for (let i = 0; i < len; i++) {
              if (checkDatas[i].Type_ID == '20' && checkDatas[i].Sub_type_id == '1') {
                this.sipZDId = checkDatas[i].ID;//固话终端
                this.getLeftExtNumber();
              }
            }
            // for (let i=0;i<res.obj.list.length;i++){
            //   res.obj.list[i]['gloUserType'] = res.obj.list[i].ID;
            // }
            this.stateAllSubTypeDatas = checkDatas;
          }
        }).catch(err => {
          // 异常情况
          console.log(err);
        });
      },
      //获取坐席编号
      queryFreeAOC() {

        UserManage.queryFreeAOC({}).then(res => {
          // 返回数据
          if (res.success) {
            let resData = res.obj.list;
            let agents = this.AgentsArray;
            let data = [
              {
                agent_id: this.form.agentId,
              },
            ];
            for (let a = 0; a < resData.length; a++) {
              let obj = {
                agent_id: parseInt(resData[a].agent_id),
              };
              data.push(obj);
            }
            let temArray = [];
            for (let j = 0; j < agents.length; j++) {
              for (let i = 0; i < data.length; i++) {
                if (data[i].agent_id === agents[j].id) {
                  let obj = {
                    // id:parseInt(agents[j].id),
                    sortId: agents[j].sortId,
                    name: agents[j].name,
                    agentId: agents[j].id,
                  };
                  temArray.push(obj);
                }
              }
            }
            let sortDataA = [];
            let sortDataB = [];
            let sortDataC = [];
            let sortDataD = [];
            let changeData = [...temArray];
            for (let k = 0; k < changeData.length; k++) {
              if (RegExp(/A/).exec(changeData[k].name)) {
                sortDataA.push(changeData[k]);
              } else if (RegExp(/B/).exec(changeData[k].name)) {
                sortDataB.push(changeData[k]);
              } else if (RegExp(/C/).exec(changeData[k].name)) {
                sortDataC.push(changeData[k]);
              } else if (RegExp(/D/).exec(changeData[k].name)) {
                sortDataD.push(changeData[k]);
              }
            }

            function compare(key) {
              return function(value1, value2) {
                var val1 = value1[key];
                var val2 = value2[key];
                return val1 - val2;
              };
            }

            sortDataA.sort(compare('sortId'));
            sortDataB.sort(compare('sortId'));
            sortDataC.sort(compare('sortId'));
            sortDataD.sort(compare('sortId'));
            let objA = {
              label: '热门城市',
              options: sortDataA,
            };
            let objB = {
              label: '热门城市',
              options: sortDataA,
            };
            let objC = {
              label: '热门城市',
              options: sortDataA,
            };
            let objD = {
              label: 'D区',
              options: sortDataA,
            };

            this.AgentIdArray = [...sortDataA, ...sortDataB, ...sortDataC, ...sortDataD];

            //TODO 可分组，或者下拉分组
            let AgentIdArrayGroup = [
              {
                label: 'A区域',
                options: [...sortDataA],
              }, {
                label: 'B区域',
                options: [...sortDataB],
              }, {
                label: 'C区域',
                options: [...sortDataC],
              }, {
                label: 'D区域',
                options: [...sortDataD],
              },
            ];
            console.log('选项数据');
            console.log(this.AgentIdArray);
          }
        }).catch(err => {

        });
      },
      //坐席类型改变
      handleAgentTypeChange(val) {
        console.log(val);
        //TODO 根据坐席类型，获取坐席编号
        //1：AOC坐席 ； 0：非AOC坐席
        this.queryFreeAOC();
        if (val == 1) {
          this.form.agentId = null;
        }

      },
      loadDataaa: function(node) {
        var data = {
          fleetId: node.id,
          pageNum: 1,
          pageSize: this.pageSize,
        };
        this.searchData.fleetName = node.name;
        this.searchData.fleetId = node.id;
        UserManage.getFleetUser(data).then(res => {
          // 返回数据
          var data = res;
          for (var i = 0; i < data.obj.list.length; i++) {
            data.obj.list[i].CREATEDATETIME = this.GlobalFunc.timeFormatRow(data.obj.list[i].CREATEDATETIME);
          }
          if (res.success) {
            console.log(data.obj.list);
            this.tableData = data.obj.list;
            this.total = data.obj.total;
          }
        }).catch(err => {
          this.userName = '';
          // 异常情况
          console.log(err);
        });
      },
      loadChildren(node, resolve) {
        if (node.data) {
          this.getChild(node.data.id, node.data.type, resolve);
        } else {
          setTimeout(() => { this.getChild(this.FleetId, 0, resolve);}, 0);
        }
      },
      getChild: function(id, type, resolve) {
        let data = {
          parentId: id,
          type: type,
        };
        UserManage.getFleet(data).then(res => {
          // 返回数据
          res = res;
          if (res.success) {
            var childNodes = [];
            if (res.obj) {
              childNodes = res.obj;
            }
            resolve(childNodes);
          }
        }).catch(err => {
          // 异常情况
          console.log(err);
        });
      },
      filterNode: function(value, data) {
        if (!value)
          return true;
        else
          return data.name.indexOf(value) !== -1;
      },
      loadData(node) {
        this.fleetName = node.name;
        this.searchData.fleetName = node.name;
        this.searchData.fleetId = node.id;
        // this.chooseloadData = false;
        console.log(node);
        // $('.el-select-dropdown').hide()

      },
      focusQuery() {
        $('.el-select-dropdown').show();
      },
      loadDataa: function(node) {
        this.form.fleetName = node.name;
        this.form.fleetId = node.id;
        // $('.el-select-dropdown').hide()

      }, //通讯录管理层级
      clickabfleetId: function(node) {
        this.form.abfleetName = node.name;
        this.form.abfleetId = node.id;
      },

      queryselectChange() {
        console.log('kdk');
      },
      //vuex获取store中方法
      ...mapActions('user', ['chageGlobalUserRoles']),
      //时间转换
      timeFormat(time) {
        var date, Y, M, D, h, m, s;
        date = new Date(time);
        Y = date.getFullYear() + '年';
        M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '月';
        D = (date.getDate() < 10 ? ('0' + date.getDate()) : date.getDate()) + '日 ';
        h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + '时';
        m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + '分';
        s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds()) + '秒';
        ;
        return Y + M + D + h + m + s;
      },
      query(pageNum) {
        if (pageNum) {
          this.pageNum = pageNum;
        }
        let data = {
          fleetId: this.searchData.fleetId || this.FleetId,
          // fleetId:this.FleetId,
          userName: this.userName || '',
          pageNum: this.pageNum,
          pageSize: this.pageSize,
          agentId: '',
        };
        if (data.fleetId === '') {
          data.fleetId = this.FleetId;
        }
        UserManage.getFleetUser(data).then(res => {
          // 返回数据
          for (var i = 0; i < res.obj.list.length; i++) {
            res.obj.list[i].CREATEDATETIME = this.GlobalFunc.timeFormatRow(res.obj.list[i].CREATEDATETIME);
          }
          if (res.success) {
            this.tableData = res.obj.list;
            console.log(this.tableData);
            this.total = res.obj.total;
            this.userName = '';
            this.fleetName = '';
            this.searchData.fleetName = '';
            this.searchData.fleetId = '';
            this.chageGlobalUserRoles(this.$store.getters.userAccount);
          } else {
            this.userName = '';
            this.$message('');
          }
        }).catch(err => {
          this.userName = '';
          // 异常情况
          console.log(err);
        });
      },
      //获取左话机号
      getLeftExtNumber: function() {
        UserManage.getFleetSubByType(
            {
              fleetId: this.FleetId,
              // fleetId:4,
              subType: this.sipZDId,
            },
        ).then(res => {
          // 返回数据
          if (res.obj.list.length > 0) {
            this.leftextNumberArray = res.obj.list;
          }
        }).catch(err => {
          // 异常情况
          console.log(err);
        });
      },
      getExtNumber() {
        UserManage.getExtNumber({type: 1}).then(res => {
          // 返回数据
          var data = res;
          if (res.success) {
            this.extNumberOptions = data.obj.list;
          } else {
            this.$message(res.msg);
          }
        }).catch(err => {
          // 异常情况
          console.log(err);
        });
      },
      getRoleName: function() {
        UserManage.getRoleName({fleetId: this.FleetId}).then(res => {
          // 返回数据
          var data = res;
          if (res.success) {
            this.roleNameOptions = data.obj.list;
          } else {
            this.$message(res.msg);
          }
        }).catch(err => {
          // 异常情况
          console.log(err);
        });
      },
      formClear() {
        this.form.userId = '';
        this.form.user_id = '';
        this.form.userName = '';
        this.form.fleetId = '';
        this.form.fleetName = '';
        this.form.extNumber = '';
        this.form.roleName = [];
        this.form.leftExt = '';
        this.form.password = '';
        this.form.newPassword = '';
        this.form.leftExt = '';
        this.form.agentType = '';
        this.form.rightExt = '';
        this.form.agentId = 0;
      },
      add: function() {
        this.getLeftExtNumber();
        this.getExtNumber();
        this.getRoleName();
        this.formClear();
        this.queryFreeAOC();
        this.showBox = true;
        this.showAdd = true;
        this.title = '添加用户';
        this.$nextTick(() => {
          this.$refs['form'].resetFields();
        });
      },
      getUser(){
        let data = {
          userId: 'wxq1',
        }
        UserManage.getUserBycount(data).then(res => {
        }).catch(err => {
          // 异常情况
          console.log(err);
        });
      },
      closeAddDialog() {
        this.form.userId = '';
        this.form.user_id = '';
        this.form.userName = '';
        this.form.fleetId = '';
        this.form.fleetName = '';
        this.form.extNumber = '';
        this.form.roleName = [];
        this.form.leftExt = '';
        this.form.password = '';
        this.form.newPassword = '';
        this.form.leftExt = '';
        this.form.agentType = '';
        this.form.rightExt = '';
        this.form.agentId = 0;
        this.$nextTick(() => {
          this.$refs['form'].resetFields();
        });
        console.log(this.form);
      },
      closePwdDialog() {
        this.$nextTick(function() {
          this.$refs['pwdForm'].resetFields();
        });
      },
      addUser: function(formName) {
        let validate = false;
        this.$refs[formName].validate((valid) => {
          if (valid) {
            validate = true;
          } else {
            validate = false;
            return false;
          }
        });
        if (validate === false) {
          return;
        }
        var data = {
          userId: this.form.userId,
          userName: this.form.userName,
          fleetId: this.form.fleetId,
          extNumber: this.form.extNumber,
          roleName: this.form.roleName,
          leftExt: this.form.leftExt,
          rightExt: this.form.rightExt,
          versionType: 1,
          type: 1,
          agentId: this.form.agentId,
          abfleetId: this.form.abfleetId,
        };
        data.managePriv = 7;
        if (this.form.userId === '' || this.form.userName === '') {
          this.$message('用户名不能为空');
          return;
        }
        if (data.extNumber.length > 20) {
          this.$message.error('IP分机号码长度不能超过20个字符！');
          return;
        }
        if (data.leftExt == data.extNumber) {
          this.$message.error('话机分机号和IP分机号码不能相同！');
          return;
        }
        if (this.form.fleetId === '') {
          this.$message('归属部门不能为空');
          return;
        }
        if (this.form.roleName === []) {
          this.$message('所属角色不能为空');
          return;
        }

        var auditData = {
          dcId: this.$store.getters.userAccount,
          type: 5,
          status: '成功',
          describe: this.$store.getters.userName + '添加调度员用户:' + data.userName,
          time: new Date,
          fleetId: this.$store.getters.scsFleetId,
          detailType: 24,
          remark: '',
        };
        UserManage.addUser(data).then(res => {
          // 返回数据
          if (res.success) {

            let row = res.obj.count;
            if (row) {
              switch (row) {
                case 1 ://添加修改成功
                  this.GlobalFunc.GlaAddAudit(auditData);
                  this.closeBox();
                  this.$message.success('添加成功');
                  this.query();
                  break;
                case 2 ://分机号已被使用
                  auditData.status = '失败:分机号已被使用';
                  this.GlobalFunc.GlaAddAudit(auditData);

                  this.$message.error('分机号已被使用');
                  break;
                case 3 ://分机号类型错误
                  auditData.status = '失败:分机号类型错误';
                  this.GlobalFunc.GlaAddAudit(auditData);
                  this.$message.error('分机号类型错误');
                  break;
                case 4 ://非分机号
                  auditData.status = '失败:登录编号重复';
                  this.GlobalFunc.GlaAddAudit(auditData);
                  this.$message.error('登录编号重复');
                  break;
              }
            }
          } else {
            this.$message(res.msg);
          }
        }).catch(err => {
          // 异常情况
          console.log(err);
        });
      },

      updateUser: function(formName) {
        let validate = false;
        this.$refs[formName].validate((valid) => {
          if (valid) {
            validate = true;
          } else {
            validate = false;
            return false;
          }
        });
        if (validate === false) {
          return;
        }
        var data = {
          userId: this.form.userId,
          user_id: this.form.user_id,
          userName: this.form.userName,
          fleetId: this.form.fleetId,
          extNumber: this.form.extNumber,
          roleName: this.form.roleName,
          leftExt: this.form.leftExt,
          rightExt: this.form.rightExt,
          versionType: 1,
          // type: this.form.agentType,
          type: 1,
          agentId: this.form.agentId,
          abfleetId: this.form.abfleetId,
        };
        data.managePriv = 7;
        if (this.form.userId === '' || this.form.userName === '') {
          this.$message('用户名或密码不能为空');
          return;
        }
        if (data.extNumber.length > 20) {
          this.$message.error('IP分机号码长度不能超过20个字符！');
          return;
        }
        if (data.leftExt == data.extNumber) {
          this.$message.error('话机分机号和IP分机号码不能相同！');
          return;
        }
        if (this.form.fleetId === '') {
          this.$message('归属部门不能为空');
          return;
        }
        if (this.form.roleName === []) {
          this.$message('所属角色不能为空');
          return;
        }

        var auditData = {
          dcId: this.$store.getters.userAccount,
          type: 5,
          status: '成功',
          describe: this.$store.getters.userName + '修改调度员用户:' + data.userName,
          time: new Date,
          fleetId: this.$store.getters.scsFleetId,
          detailType: 24,
          remark: '',
        };
        UserManage.updateUser(data).then(res => {
          // 返回数据
          if (res.success) {

            let row = res.obj.count;
            if (row) {
              switch (row) {
                case 1 ://添加修改成功
                  this.GlobalFunc.GlaAddAudit(auditData);
                  this.closeBox();
                  this.$message.success('编辑成功');
                  this.query(this.pageNum);
                  this.$emit('changeUserLevels',this.form.userId);
                  // this.chooseForm.seen = false;
                 /* if (data.type == 1) {
                    this.$emit('changeAgentPostionHome', this.tempAgentId, data.agentId);
                  } else {
                    this.$emit('changeAgentPostionHome', this.tempAgentId, '');
                  }*/
                  break;
                case 2 ://分机号已被使用
                  auditData.status = '失败:分机号已被使用';
                  this.GlobalFunc.GlaAddAudit(auditData);

                  this.$message.error('分机号已被使用');
                  break;
                case 3 ://分机号类型错误
                  auditData.status = '失败:分机号类型错误';
                  this.GlobalFunc.GlaAddAudit(auditData);
                  this.$message.error('分机号类型错误');
                  break;
                case 4 ://非分机号
                  auditData.status = '失败:登录编号重复';
                  this.GlobalFunc.GlaAddAudit(auditData);
                  this.$message.error('登录编号重复');
                  break;
              }
            }
          } else {
            this.$message(res.msg);
          }
        }).catch(err => {
          // 异常情况
          console.log(err);
        });
      },
      updatePassword: function(formName) {
        let validate = false;
        this.$refs[formName].validate((valid) => {
          if (valid) {
            validate = true;
          } else {
            validate = false;
            return false;
          }
        });
        if (validate === false) {
          return;
        }
        var that = this;
        if (that.form.password != that.form.newPassword) {
          that.$message('密码不一致');
          return;
        }
        var data = {
          userId: that.form.userId,
          password: Md5_Encrpt(that.form.password),

        };
        var auditData = {
          dcId: this.$store.getters.userAccount,
          type: 5,
          status: '成功',
          describe: this.$store.getters.userName + '修改该调度员用户密码:' + that.form.userName,
          time: new Date,
          fleetId: this.$store.getters.scsFleetId,
          detailType: 24,
          remark: '',
        };
        UserManage.updatePassword(data).then(res => {
          // 返回数据
          if (res.success) {
            this.GlobalFunc.GlaAddAudit(auditData);
            that.closeBox();
            that.$message.success('编辑成功');
            that.query(that.pageNum);
          } else {
            auditData.status = '失败';
            this.GlobalFunc.GlaAddAudit(auditData);

            this.$message(res.msg);
          }
        }).catch(err => {
          // 异常情况
          console.log(err);
        });
      },
      closeBox: function() {
        this.formClear();
        this.showBox = false;
        this.showEPBox = false;
      },
      operate(row, href) {
        console.log('rgklgkgkgkow');
        console.log(row);
        this.formClear();
        if (href.indexOf('update') !== -1) {
          this.getLeftExtNumber();
          this.getExtNumber();
          this.getRoleName();
          this.queryFreeAOC();

          this.showBox = true;
          this.showAdd = false;
          this.title = '编辑用户';
          this.form.userId = row.ID;
          this.form.user_id = row.user_id;
          this.form.userName = row.NAME;
          this.form.fleetId = row.FLEET_ID;
          this.form.fleetName = row.fleetName;
          this.form.extNumber = row.EXTNUMBER;
          this.form.agentType = row.type;
          this.form.abfleetId = row.abfleetId;
          this.form.abfleetName = row.abFleetName;
          let agents = this.AgentsArray;
          /* for (let i = 0; i < agents.length; i++) {
               if (agents[i].id == row.agentId) {
                 this.form.agentId = agents[i].name;
               }
           }*/
          var roleName = [];
          this.tempAgentId = row.agentId;
          console.log('row.a77gentId');
          console.log(row.agentId);
          this.form.agentId = parseInt(row.agentId);

          roleName = row.roleName.split(',');
          let newArray = [];
          for (var i = 0; i < roleName.length; i++) {
            console.log(this.form.roleName);
            newArray.push(parseInt(roleName[i]));
          }
          this.form.roleName = newArray;
          this.form.leftExt = row.leftExt;
          this.form.rightExt = row.rightExt;
        } else if (href.indexOf('password') !== -1) {
          this.showEPBox = true;
          this.title = '编辑用户密码';
          this.form.userId = row.ID;
        } else if (href.indexOf('manage') !== -1) {

        } else {
          var auditData = {
            dcId: this.$store.getters.userAccount,
            type: 5,
            status: '成功',
            describe: this.$store.getters.userName + '删除了调度员用户:' + row.NAME,
            time: new Date,
            fleetId: this.$store.getters.scsFleetId,
            detailType: 24,
            remark: '',
          };

          this.$confirm('是否确定删除', '', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
          }).then(() => {
            UserManage.deleteUser({
              userId: row.ID,
              user_id: row.user_id,
              extNumber: row.EXTNUMBER,
              leftExt: row.leftExt,
            }).then(res => {
              // 返回数据
              var res = res;
              if (res.success) {
                this.GlobalFunc.GlaAddAudit(auditData);
                this.$message.success('删除成功');
                this.query(1);
              }
            }).catch(err => {
              // 异常情况
              auditData.status = '删除失败';
              this.GlobalFunc.GlaAddAudit(auditData);

              console.log(err);
            });
          }).catch(() => {
          });

        }
      },
      changePageNum: function(val) {
        this.pageNum = val;
        this.query();
      },
    },
  };
</script>

<style scoped>
    /*处理input type = number的上下箭头*/
    input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{
        -webkit-appearance:textfield;
    }
    input[type="number"]{
        -moz-appearance:textfield;
    }
    input::-webkit-outer-spin-button,
    input::-webkit-inner-spin-button {
        -webkit-appearance: none !important;
    }
    input[type="number"]{
        -moz-appearance: textfield;
    }
    .searchForm /deep/ .el-form-item__label {
        font-size: 22px !important;
    }

    .searchForm /deep/ .el-input__inner {
        font-size: 22px !important;
    }

    /deep/ .el-message__content {
        font-size: 40px;
    }

    /deep/ .el-form-item__label {
        font-size: 22px !important;
    }

    /deep/ .el-input__inner {
        font-size: 22px !important;
    }

    /deep/ .el-tree-node__label {
        font-size: 25px;
    }

    /deep/ .el-tree-node {
        margin-top: 25px !important;
        height: auto;
    }

    /deep/ .el-select-dropdown__item {
        font-size: 20px;
    }

    /deep/ .el-dialog__title {
        font-size: 22px;
    }

    /deep/ .el-icon-close:before {
        font-size: 25px;
    }

    /*分页修改开始*/
    .el-pagination /deep/ .el-pagination__total {
        font-size: 20px;
        line-height: 60px;
    }

    .el-pagination /deep/ button /deep/ .el-icon .el-icon .el-icon-arrow-left {
        font-size: 50px;
        height: 60px;
        width: 40px;
    }

    /deep/ .el-pager li {
        margin-top: 15px;
        height: 60px;
        width: 60px;
        line-height: 60px;
        font-size: 18px;
    }

    /deep/ .el-pagination.is-background .btn-prev, .el-pager li {
        height: 60px;
        width: 60px;
    }

    /deep/ .el-pagination.is-background .btn-next, .el-pager li {
        height: 60px;
        width: 60px;
    }

    /deep/ .el-pagination .btn-prev .el-icon {
        font-size: 40px;
    }

    /deep/ .el-pagination .btn-next .el-icon {
        font-size: 40px;
    }

    /deep/ .el-icon-caret-right:before {
        font-size: 40px!important;
    }

    /*分页修改结束*/
    .headerCellClassName {
        font-size: 15px;
        text-align: center;
        color: #515A6E;
        padding: 10px 0px 10px 0px !important;
        background: #F5F5F6;
        border: 1px solid #EBEBEB

    }

    .treeLableImg {
        height: 25px;
        width: 25px;
        margin-right: 10px;
        vertical-align: middle
    }

    .searchForm {
        /*margin: 20px 0% 0 20%;*/
    }

    .searchFormBtn {
        margin-left: 5px;
        display: inline-block;
    }

    .leftTreeClass {
        float: left;
        width: 19%;
        height: 600px;
        background: white;
        position: absolute;
    }

    /*优化start*/

    @media screen and (max-width: 1920px) and (max-height: 1280px) {
        .leftTreeClass {
            float: left;
            width: 19%;
            height: 1200px;
            background: #ffffff;
            position: absolute;
            border-right: 1px solid #EBEEF5;
        }
    }

    /*优化end*/

    /* 树形结构节点添加连线 */
    /*.tree /deep/ .el-tree-node {
        position: relative;
        padding-left: 16px;
    }

    .tree /deep/ .el-tree-node__children {
        padding-left: 16px;
    }

    .tree /deep/ .el-tree-node :last-child:before {
        height: 38px;
    }

    .tree /deep/ .el-tree > .el-tree-node:before {
        border-left: none;
    }

    .tree-container /deep/ .el-tree > .el-tree-node:after {
        border-top: none;
    }

    .tree /deep/ .el-tree-node:before {
        content: "";
        left: -4px;
        position: absolute;
        right: auto;
        border-width: 1px;
    }

    .tree /deep/ .el-tree-node:after {
        content: "";
        left: -4px;
        position: absolute;
        right: auto;
        border-width: 1px;
    }
    .tree /deep/ .el-tree-node__expand-icon.is-leaf {
        display: none;
    }

    .tree /deep/ .el-tree-node:before {
        border-left: 1px solid #b8b9bb;
        bottom: 0px;
        height: 100%;
        top: -26px;
        width: 1px;
    }

    .tree /deep/ .el-tree-node:after {
        border-top: 1px solid #b8b9bb;
        height: 20px;
        top: 12px;
        width: 24px;
    }*/

</style>
